<template>
	<view class="empty u-flex-center">
		<view class="empty-content">
			<view class="title">{{isLogin?'您的购物车为空哦~':'您还未登录哦~'}}</view>
			<view class="empty-content" v-if="isLogin">可以去看看有哪些想买的</view>
			<view class="empty-jump" @click="jump()">{{isLogin?'去看看':'去登录'}}</view>
		</view>
	</view>
</template>
<script>
	import {
		mapState,
	} from 'vuex';
	export default {
		name: "empty",
		data() {
			return {};
		},
		// 此处定义传入的参数
		props: {
				list: {
					type: Array,
					default: (() => {
						return [];
					})
				},
		},
		computed: {
			...mapState({
				isLogin: state => state.user.isLogin,
			})
		},
		methods: {
			jump() {
				if (this.isLogin) { // 已登陆
					this.$navigateTo('/subPackages/product/product-list')
				} else { // 未登录
					this.$toLogin()
				}
			}
		}
	}
</script>
<style lang="scss" scoped>
	.empty {
		width: 100%;
		height: 500rpx;
		text-align: center;

		.empty-content {

			.title {
				color: #4e4e4e;
				font-size: 26rpx;
			}

			.empty-content {
				padding: 20rpx 0 30rpx;
				font-size: 22rpx;
				color: #9b9b9b;
			}

			.empty-jump {
				width: 120rpx;
				height: 45rpx;
				line-height: 45rpx;
				font-size: 24rpx;
				background-color: #000000;
				color: #FFFFFF;
				margin: 20rpx auto 0;
			}
		}
	}
</style>